<template>
  <div class="annularMutiBar-chat-container">
    <DataVCustomGauge1 :value='value' :chartOptions='chartOptions' v-if="gaugeType === 1" />
    <DataVCustomGauge2 :value='value' :chartOptions='chartOptions' v-if="gaugeType === 2" />
    <DataVCustomGauge3 :value='value' :chartOptions='chartOptions' v-if="gaugeType === 3" />
  </div>
</template>
<script>
import DataVCustomGauge1 from "./gauge1/index";
import DataVCustomGauge2 from "./guage2/index.vue";
import DataVCustomGauge3 from "./guage3/index.vue";
export default {
  name: "data-v-customGauge",
  components: {
    DataVCustomGauge1,
    DataVCustomGauge2,
    DataVCustomGauge3,
  },
  props: {
    gaugeType: {
      type: Number,
      default: 1,
    },
    chartOptions: {
      type: Object,
      default: () => {},
    },
    value:{
        type:Number,
        default:0
    }
  },
};
</script>
<style src='./index.css' scoped></style>